Page({
    data: {
      records: [
        { 
          id: 1, 
          type: '支出', 
          category: '餐饮', 
          amount: 50, 
          date: '2023-05-20', 
          account: '现金',
          party: '小明',
          avatarUrl: './image/avator.webp'
        },
        { 
          id: 2, 
          type: '收入', 
          category: '工资', 
          amount: 5000, 
          date: '2023-05-19', 
          account: '银行卡',
          party: 'ABC公司',
          avatarUrl: './image/avator.webp'
        },
        { 
          id: 3, 
          type: '支出', 
          category: '交通', 
          amount: 20, 
          date: '2023-05-18', 
          account: '微信钱包',
          party: '滴滴出行',
          avatarUrl: './image/avator.webp'
        },
        { 
          id: 4, 
          type: '支出', 
          category: '购物', 
          amount: 200, 
          date: '2023-05-17', 
          account: '信用卡',
          party: '淘宝商城',
          avatarUrl: './image/avator.webp'
        },
        { 
          id: 5, 
          type: '收入', 
          category: '兼职', 
          amount: 500, 
          date: '2023-05-16', 
          account: '支付宝',
          party: '某某公司',
          avatarUrl: './image/avator.webp'
        },
      ],
    filteredRecords: [],
    dateFilter: '全部',
    typeOptions: ['全部', '支出', '收入'],
    typeIndex: 0,
    accountOptions: ['全部', '现金', '银行卡', '微信钱包', '支付宝', '信用卡'],
    accountIndex: 0
  }
  ,
  onLoad: function() {
   
    this.filterRecords();
  },

  filterRecords: function() {
    let filtered = this.data.records;

    if (this.data.dateFilter !== '全部') {
      filtered = filtered.filter(record => record.date === this.data.dateFilter);
    }

    if (this.data.typeIndex !== 0) {
      const typeFilter = this.data.typeOptions[this.data.typeIndex];
      filtered = filtered.filter(record => record.type === typeFilter);
    }

    if (this.data.accountIndex !== 0) {
      const accountFilter = this.data.accountOptions[this.data.accountIndex];
      filtered = filtered.filter(record => record.account === accountFilter);
    }

    this.setData({ filteredRecords: filtered });
  },

  onDateChange: function(e) {
    this.setData({ dateFilter: e.detail.value });
    this.filterRecords();
  },

  onTypeChange: function(e) {
    this.setData({ typeIndex: e.detail.value });
    this.filterRecords();
  },

  onAccountChange: function(e) {
    this.setData({ accountIndex: e.detail.value });
    this.filterRecords();
  }
})